<ion-header  class="nav-header">
    <ion-toolbar>
        <ion-buttons slot="start">
            <ion-button (click)="backClick()">
              <ion-icon class="md-arrow-back"  ios="md-arrow-back"></ion-icon>
            </ion-button>
          </ion-buttons>
      <ion-title>额度转化</ion-title>
      <ion-buttons slot="end">
            <ion-button class="toolbar-white" (click)="onRefresh()">
                <ion-icon class="iconfont ion-ios-gengxin" style="font-size: 24px;"></ion-icon>
            </ion-button>
          </ion-buttons>
    </ion-toolbar>
  </ion-header>

<ion-content class="quota-page">
<div class="q-p-header">
    <div class="q-p-header-item">
        <div style="margin-bottom: 4px;padding-top: 8px;">
            <ion-icon class="iconfont  ion-ios-zhongxinqianbao" style="font-size: 30px; color: #d81e06; margin-right: 4px;"></ion-icon><span (click)="toAccountrecharge()" style="position: absolute;right: 0px; padding: 0px 20px;padding: 4px 6px;border: 2px solid #ff0000;color: #203864;border-radius: 8px; line-height: 17px;">充值</span>
        </div>
    </div>
    <div class="q-p-header-item"><span style="width: 80px; display: inline-block;">总资产</span><span class="q-p-header-item-val"><ion-icon class="iconfont  ion-ios-qian" style="font-size: 18px; color: #efb336; margin-right: 4px;"></ion-icon>{{totalBalance}}</span></div>
    <div class="q-p-header-item"><span style="width: 80px; display: inline-block;">{{firstName}}</span><span class="q-p-header-item-val"><ion-icon class="iconfont  ion-ios-qian" style="font-size: 18px; color: #efb336; margin-right: 4px;"></ion-icon>{{firstBalance}}</span></div>
    <div class="q-p-header-item"><span style="width: 80px; display: inline-block;">{{secondName}}</span><span  class="q-p-header-item-val"><ion-icon class="iconfont  ion-ios-qian1" style="font-size: 20px; color: #efb336; margin-right: 4px;"></ion-icon>{{secondBalance}}</span></div>
</div>

<div class="q-p-input">
    <div class="q-p-i-money" style="font-size: 16px; color: #333;">金额(元)</div>
    <div class="q-p-i-input">
        <div style="flex:260;"><ion-input [(ngModel)]="inputVal" style="border: 1px solid #E8E9EC; --padding-start:10px; padding-left: 10px;" placeholder="请输入正整数的金额"></ion-input></div>
        <div style="flex: 80; text-align: right;" (click)="onInputMax()"><span class="q-p-i-input-btn">最大</span></div>
    </div>
</div>
<div class="q-p-group-btn" *ngIf="isShowBtnGroup">
    <div class="p-p-g-btn"><div class="p-p-btn-c" style="background: #ffcccc;border-radius: 5px; color: #000;" (click)="openPicker('one')">{{firstName}}</div></div>
    <div class="p-p-g-btn"><div class="p-p-btn-c" style="background: #fff;border-radius: 5px; color: #000;" (click)="openPicker('two')">{{secondName}}</div></div>
    <div class="p-p-g-btn"><div class="p-p-btn-c bg" style="color: #fff;border-radius: 5px;" (click)="onTrans()">立即转账</div></div>
    <div class="p-p-g-btn"><div class="p-p-btn-c bg" style=" color: #fff; border-radius: 5px;" (click)="onRecycle()">一键回收</div></div>
</div>

</ion-content>
<app-tab-self></app-tab-self>